<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数据采集</title>
    <link rel="stylesheet" href="library/layui/css/layui.css">
    <link rel="stylesheet" href="css/index.css">
</head>

<body>
    <div class="container">
        <div class="layui-row">
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                <div class="head">
                    <h1 id="title">数据采集</h1>
                    <div class="right">
                        <img id="minimize" src="assets/images/minimize.png" alt="">
                        <img id="close" src="assets/images/close.png" alt="">
                    </div>
                </div>
                <div class="content">
                    <div class="layui-row">
                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                            <div class="layui-tab layui-tab-brief" lay-filter="filter">
                                <ul class="layui-tab-title">
                                    <li lay-id="data">数据</li>
                                    <li lay-id="chart" class="layui-this">曲线</li>
                                    <li>历史</li>
                                </ul>
                                <div class="layui-tab-content">
                                    <div class="layui-tab-item ">
                                        <div class="layui-row">
                                            <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                                                <div class="boxall">
                                                    <div class="box-title">计时面板</div>
                                                    <div class="layui-row box-row">
                                                        <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                                                            <div class="border">
                                                                <p id="total_time">00:00:00</p>
                                                                <p>总计用时</p>
                                                            </div>
                                                        </div>
                                                        <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                                                            <p id="stage_time">00:00:00</p>
                                                            <p id="stage_name">阶段计时</p>
                                                        </div>
                                                    </div>
                                                    <div class="layui-row">
                                                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                                                            <ul class="keeptime">
                                                                <li id="firstStageRow">
                                                                    <h2 id="firstStage">--</h2><span>阶段一</span>
                                                                </li>
                                                                <li id="secondStageRow">
                                                                    <h2 id="secondStage">--</h2><span>阶段二</span>
                                                                </li>
                                                                <li id="thirdStageRow">
                                                                    <h2 id="thirdStage">--</h2><span>阶段三</span>
                                                                </li>
                                                                <li id="intensityStageRow">
                                                                    <h2 id="intensityStage">--</h2><span>强度段</span>
                                                                </li>
                                                                <li id="rigorStageRow">
                                                                    <h2 id="rigorStage">--</h2><span>严密段</span>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>

                                                    <div class="layui-row">
                                                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                                                            
                                                        </div>
                                                    </div>
                                                    <div class="boxfoot"></div>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                                                <div class="boxall">
                                                    <div class="box-title">信息面板</div>
                                                    <div class="layui-row border-bottom box-row">
                                                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                                                            <div class="border">
                                                                <p id="time">00:00:00</p>
                                                                <p id="date">总计用时</p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="layui-row">
                                                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                                                            <ul class="keeptime">
                                                                <li id="start">
                                                                    <div class="image"><img
                                                                            src="assets/images/start.png" alt=""></div>
                                                                    <span id="startBtn">开始采集</span>
                                                                </li>
                                                                <li id="report">
                                                                    <div class="image"><img
                                                                            src="assets/images/report.png" alt=""></div>
                                                                    <span>试压报告</span>
                                                                </li>
                                                                <li id="project">
                                                                    <div class="image"><img
                                                                            src="assets/images/project.png" alt="">
                                                                    </div>
                                                                    <span>选择工程</span>
                                                                </li>
                                                                <li id="template">
                                                                    <div class="image"><img
                                                                            src="assets/images/template.png" alt="">
                                                                    </div>
                                                                    <span>添加模板</span>
                                                                </li>
                                                                <li id="set">
                                                                    <div class="image"><img src="assets/images/set.png"
                                                                            alt=""></div>
                                                                    <span>设置面板</span>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                    <div class="boxfoot"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-row">
                                            <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                                                <div class="boxall">
                                                    <div class="box-title">近端数据</div>
                                                    <ul class="data">
                                                        <li>
                                                            <h2 id="lpressure">0</h2><span>近端压力(Mpa)</span>
                                                        </li>
                                                        <li>
                                                            <h2 id="ltemplature">0</h2><span>近端介质温度(℃)</span>
                                                        </li>
                                                    </ul>
                                                    <div style="border-bottom: 1px solid rgba(255,255,255,.1)"></div>
                                                    <ul class="data">
                                                        <li>
                                                            <h2 id="etemplature">0</h2><span>环境温度(℃)</span>
                                                        </li>
                                                        <li>
                                                            <h2 id="lmachinetemplature">0</h2><span>近端机箱温度(℃)</span>
                                                        </li>
                                                    </ul>
                                                    <div class="boxfoot"></div>
                                                </div>
                                            </div>
                                            <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                                                <div class="boxall">
                                                    <div class="box-title">远端数据</div>
                                                    <ul class="data">
                                                        <li>
                                                            <h2 id="rpressure">0</h2><span>远端压力(Mpa)</span>
                                                        </li>
                                                        <li>
                                                            <h2 id="rtemplature">0</h2><span>远端介质温度(℃)</span>
                                                        </li>
                                                    </ul>
                                                    <div style="border-bottom: 1px solid rgba(255,255,255,.1)"></div>
                                                    <ul class="data">
                                                        <li>
                                                            <h2 id="rmachinetemplature">0</h2><span>远端机箱温度(℃)</span>
                                                        </li>
                                                    </ul>
                                                    <div class="boxfoot"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-tab-item layui-show">
                                        <div class="layui-row">
                                            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                                                <div class="boxall">
                                                    <div class="chart" id="pressure"></div>
                                                    <div class="boxfoot"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-row">
                                            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                                                <div class="boxall">
                                                    <div class="chart" id="templature"></div>
                                                    <div class="boxfoot"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-tab-item">内容-3</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="library/jquery/jquery-3.7.1.min.js"></script>
    <script src="library/layui/layui.js"></script>
    <script src="library/moment/moment.js"></script>
    <script src="library/echart/echarts.min.js"></script>
    <script src="js/index.js"></script>
    <script src="js/chart.js"></script>
</body>

</html>